(function($) {
	
	$.fn.QuestionnairesView = function() {
		
		var that = this;
		var context;
		
	    /**
	     * 
	     */
	    this.showQuestionnaireList = function(oData, context) {
	    	this.context = context;
	    	renderQuestionnairesTemplate(oData);
	    	buildAndShowTable();
	    };
	    
	    this.showQuestionnaireError = function(sError) {
	    	that.context.$element().html(ich.questionnaireDetailsHeader({}));
			$('.appStatus').text(sError).addClass("ui-state-error");
	    };
	    
	    /**
	     * Renders the ICanHaz template for the survey list
	     */
	    function renderQuestionnairesTemplate(oData) {
	    	that.context.$element().html(ich.questionnairesTable(oData));
	    };

	    /**
	     * Configures and shows the survey table
	     */
	    function buildAndShowTable() {
	    	$('#questionnairesTable').dataTable({
	    		"aaSorting": [[ 0, "asc" ]],
	    		"bFilter": true,
	    		"bJQueryUI": false,
                "oLanguage" :
                {
                	"sProcessing":   "Bitte warten...",
                	"sLengthMenu":   "_MENU_ Einträge anzeigen",
                	"sZeroRecords":  "Keine Einträge vorhanden.",
                	"sInfo":         "_START_ bis _END_ von _TOTAL_ Einträgen",
                	"sInfoEmpty":    "0 bis 0 von 0 Einträgen",
                	"sInfoFiltered": "(gefiltert von _MAX_  Einträgen)",
                	"sInfoPostFix":  "",
                	"sSearch":       "Suchen",
                	"sUrl":          "",
                	"oPaginate": {
                		"sFirst":    "Erster",
                		"sPrevious": "Zurück",
                		"sNext":     "Nächster",
                		"sLast":     "Letzter"
                	}
                }
	    	});
	    };
	    	
	    /**
	     * 
	     */
	    this.showQuestionnaire = function(context) {
	    	this.context = context;
	    	var oQuestionnaire = questionnairesModel.getQuestionnaire();
	    	
	    	// Questionnaire view
	    	this.context.$element().html(ich.questionnaireDetailsTemplate());
	    	this.renderQuestionBlockMenuTemplate(oQuestionnaire);
	    	this.renderQuestionnaireTemplate(oQuestionnaire);
	    	initQuestionnaireForm(oQuestionnaire);
			addQuestionnaireFormHandles(oQuestionnaire);
			
			// QuestionBlock view
			if(oQuestionnaire.questionBlocks.length > 0) {
				this.showQuestionBlock(oQuestionnaire.questionBlocks[0]);
				addQuestionBlockHandles(oQuestionnaire.questionBlocks[0]);
			}
	    };
	    
	    /**
	     * Renders the ICanHaz template for the question block menu
	     */
	    this.renderQuestionBlockMenuTemplate = function(oQuestionnaire) {	    	
	    	$( '#questionBlockMenu' ).html(ich.questionBlockMenuTemplate(oQuestionnaire));
	    	$( '.questionBlockMenuItem' ).each(function() {
	    		if($( this ).attr( 'state' ) == 'new')
	    			$( this ).addClass( 'selectedQuestionBlockMenuItem' );
	    	});
	    };
	    
	    /**
	     * Renders the ICanHaz template for a survey
	     */
	    this.renderQuestionnaireTemplate = function(oData) {
	    	$('#questionnaire').html(ich.questionnaireTemplate(oData));
	    };
	    
	    /**
	     * Adds handles to questionnaire menu items
	     */
	    function initQuestionnaireForm(oQuestionnaire) {
	    	$('#questionnaireTitle').editAtPlace(function(newText, oldText) {
	    		oQuestionnaire.title = newText;
	    	});
	    	$('#questionnaireDescription').editAtPlace(function(newText, oldText) {
	    		oQuestionnaire.description = newText;
	    	});
	    	$('#questionnaireCreator').editAtPlace(function(newText, oldText) {
	    		oQuestionnaire.creator = newText;
	    	});
	    	$( '#addQB' ).button({ text: false, icons: { primary: 'ui-icon-plusthick' } })
	    	.click(function() {
	    		var oQuestionBlock = questionnairesModel.addQuestionBlock();
	    		that.updateQuestionBlockViews(oQuestionBlock);
	    	});
	    };
		
	    /**
	     * 
	     */
	    function addQuestionnaireFormHandles(oQuestionnaire) {			
	    	
	    };	
	    
	    /**
	     * Renders the question block template and adds handles
	     */
	    this.showQuestionBlock = function(oQuestionBlock) {	    	
	    	$('#questionBlock').html(ich.questionBlockTemplate(oQuestionBlock));
    		
	    	// add handles
	    	$('#questionBlockTitle').editAtPlace(function(newText, oldText) {
    			oQuestionBlock.title = newText;
    			that.updateQuestionBlockViews(oQuestionBlock);
		    });
	    	$( "#moveUpQB" ).button({ text: false, icons: { primary: 'ui-icon-arrowthick-1-n' } })
	    	.click(function() {
	    	});
	    	$( "#moveDownQB" ).button({ text: false, icons: { primary: 'ui-icon-arrowthick-1-s' } })
	    	.click(function() {
	    	});
	    	$( "#delQB" ).button({ text: false, icons: { primary: 'ui-icon-trash' } })
	    	.click(function() {
	    	});
	    	$( "#addSF" ).button({ text: false, icons: { primary: 'ui-icon-radio-on' } })
	    	.click(function() {
	    	});
	    	$( "#addSMF" ).button({ text: false, icons: { primary: 'ui-icon-grip-dotted-horizontal' } })
	    	.click(function() {
	    	});
	    	$( "#addTF" ).button({ text: false, icons: { primary: 'ui-icon-script' } })
	    	.click(function() {
	    	});
	    }
		
	    /**
	     * 
	     */
	    function addQuestionBlockHandles(oQuestionBlock) {			
	    	
	    };	
	    
	    /**
	     * Updates the question block views
	     */
	    this.updateQuestionBlockViews = function(oQuestionBlock) {
	    	this.showQuestionBlock(oQuestionBlock);
	    	var oQuestionnaire = questionnairesModel.getQuestionnaire();
	    	this.renderQuestionBlockMenuTemplate(oQuestionnaire);
	    }    
	}
})(jQuery);
